<!DOCTYPE html>
<html lang="en" xmlns:shiro="http://www.thymeleaf.org/thymeleaf-extras-shiro"
      xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" th:href="@{/static/layui/css/layui.css}">
    <link rel="stylesheet" th:href="@{/static/css/custom.css}">
    <script th:src="@{/static/layui/layui.js}"></script>
    <script th:src="@{/static/js/coreutil.js}"></script>
    <!--    <script charset="utf-8" th:src="@{/layuimini/lib/layui-v2.6.3/layui.js}"></script>-->
    <script charset="utf-8" th:src="@{/layuimini/js/lay-config.js?v=2.0.0}"></script>

</head>
<body>
<!--搜索框-->
<div class="table_div" style="margin-left: 7px;margin-right: 7px">
    <div id="searchParam">
        <div class="layui-form-item">

            <div class="layui-inline" style="margin-top: 0;margin-right: 0px;margin-bottom: 0px;">
                <label class="layui-form-label" style="padding-left: 0px">角色名称</label>
                <div class="layui-input-inline">
                    <input autocomplete="off" class="layui-input" id="roleName1" placeholder="请输入角色名称"
                           type="text">
                </div>
            </div>
            <div class="layui-inline" style="margin-top: 0;margin-right: 0px;margin-bottom: 0px;">
                <label class="layui-form-label" style="padding-left: 0px">权限字符</label>
                <div class="layui-input-inline">
                    <input autocomplete="off" class="layui-input" id="roleKey1" placeholder="请输入角色权限字符串"
                           type="text">
                </div>
            </div>


            <div class="layui-inline" style="margin-top: 0;margin-right: 0px;margin-bottom: 0px;">
                <label class="layui-form-label" style="padding-left: 0px">角色状态</label>
                <div class="layui-input-inline">
                    <input autocomplete="off" class="layui-input" id="status1" placeholder="请输入角色状态（0正常 1停用）"
                           type="text">
                </div>
            </div>
            <div class="layui-inline" style="margin-top: 0;margin-right: 0px;margin-bottom: 0px;">
                <div class="layui-inline" style="margin-top: 0;margin-right: 0px;margin-bottom: 0px;">
                    <label class="layui-form-label" style="padding-left: 0px">创建时间</label>
                    <div class="layui-input-inline">
                        <input autocomplete="off" class="layui-input" id="createTime1" placeholder="请输入创建时间"
                               type="text">
                    </div>
                </div>

                <div class="layui-inline" style="margin-top: 5px">
                    <div class="layui-input-inline" style="margin-top: 5px">
                        <button class="layui-btn" id="search" onclick="search()">查询</button>
                        <button class="layui-btn" id="export">导出全部</button>
                    </div>
                </div>
            </div>

        </div>
        <table class="layui-table" id="showTable" lay-filter="showTable"></table>
    </div>
    <script id="toolbar" type="text/html">
        <div class="layui-btn-container">
            <button class="layui-btn layui-btn-sm layui-btn-normal" lay-event="add"
                    style="padding-left: 2px;padding-right: 5px;"><i class="layui-icon layui-icon-addition"
                                                                     shiro:hasPermission="system:role:add"></i>添加
            </button>
            <button class="layui-btn layui-btn-sm layui-btn-danger" lay-event="batchDeleted"
                    shiro:hasPermission="system:role:delete"
                    style="padding-left: 2px;padding-right: 5px;"><i class="layui-icon layui-icon-delete"></i>删除
            </button>
        </div>
    </script>
    <script id="tool" th:inline="none" type="text/html">
        {{#  if(d.roleName != '超级管理员'){ }}
        <a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="edit" shiro:hasPermission="system:role:update"><i
                class="layui-icon layui-icon-edit"></i>编辑</a>
        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del" shiro:hasPermission="system:role:delete"><i
                class="layui-icon layui-icon-delete"></i>删除</a>
        <a class="layui-btn  layui-btn-xs" lay-event="dist" shiro:hasPermission="role:roleUser:view"
           shiro:hasRole="admin">分配用户</a>
        {{#  } }}
    </script>


    <!--    <script id="tool" type="text/html">-->
    <!--        <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>-->
    <!--        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>-->
    <!--    </script>-->
    <!--弹出层 添加-->
    <div class="site-text" id="add" style="margin: 5%; display: none" target="test123">
        <form action="" class="layui-form " lay-filter="info" style="width: 700px;margin-top: 10px">
            <input hidden name="roleId"/>
            <div class="layui-form-item">
                <label class="layui-form-label">角色名称</label>
                <div class="layui-input-block">
                    <input autocomplete="off" class="layui-input" name="roleName"
                           placeholder="请输入角色名称" type="text">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">权限字符</label>
                <div class="layui-input-block">
                    <input autocomplete="off" class="layui-input" name="roleKey"
                           placeholder="请输入权限字符" type="text">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">显示顺序</label>
                <div class="layui-input-block">
                    <input autocomplete="off" class="layui-input" name="roleSort"
                           placeholder="请输入显示顺序" type="text">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">角色状态</label>
                <div class="layui-input-block">
                    <input checked="" lay-filter="switchTest" lay-skin="switch" lay-text="启用|停用" name="status"
                           type="checkbox">
                </div>
            </div>


            <div class="layui-form-item">
                <label class="layui-form-label">备注</label>
                <div class="layui-input-block">
                    <input autocomplete="off" class="layui-input" name="remark"
                           placeholder="请输入备注" type="text">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">菜单权限：</label>
                <div class="layui-input-block">
                    <div class="layui-btn-container" style="margin-top: 10px">
                        <button class="layui-btn layui-btn-xs" lay-demo="setChecked" type="button">全选</button>
                        <button class="layui-btn layui-btn-xs layui-btn-danger" lay-demo="reload" type="button">全不选
                        </button>
                    </div>
                    <div style="width: 500px;border:1px solid #eee">
                        <div class="demo-tree-more" id="test12" style="margin: 10px"></div>
                    </div>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button class="layui-btn" lay-demo="getChecked" lay-filter="submit" lay-submit="" type="submit">保存
                    </button>
                    <button class="layui-btn layui-btn-primary" id="btn_cancel">取消</button>
                </div>
            </div>
        </form>
    </div>
    <!--弹出层 修改-->
    <div class="site-text" id="up" style="margin: 5%; display: none" target="test123">
        <form action="" class="layui-form " lay-filter="info" style="width: 700px;margin-top: 10px">
            <div class="layui-form-item">
                <label class="layui-form-label">角色编号</label>
                <div class="layui-input-block">
                    <input autocomplete="off" class="layui-input" disabled="disabled" id="roleId"
                           name="roleId"
                           placeholder="请输入角色ID" style="background:#CCCCCC" type="text">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">角色名称</label>
                <div class="layui-input-block">
                    <input autocomplete="off" class="layui-input" id="roleName"
                           name="roleName" placeholder="请输入角色名称" type="text">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">权限字符</label>
                <div class="layui-input-block">
                    <input autocomplete="off" class="layui-input" id="roleKey"
                           name="roleKey" placeholder="请输入角色权限字符串" type="text">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">显示顺序</label>
                <div class="layui-input-block">
                    <input autocomplete="off" class="layui-input" id="roleSort"
                           name="roleSort" placeholder="请输入显示顺序" type="text">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">角色状态</label>
                <div class="layui-input-block" id="sta">
                    <input checked="" id="status" lay-filter="switchTest1" lay-skin="switch" lay-text="启用|停用"
                           name="status" type="checkbox">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">备注</label>
                <div class="layui-input-block">
                    <input autocomplete="off" class="layui-input" id="remark"
                           name="remark" placeholder="请输入备注" type="text">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">菜单权限：</label>
                <div class="layui-input-block">
                    <div class="layui-btn-container" style="margin-top: 10px">
                        <button class="layui-btn layui-btn-xs" lay-demo="setChecked1" type="button">全选</button>
                        <button class="layui-btn layui-btn-xs layui-btn-danger" lay-demo="reload1" type="button">还原
                        </button>
                    </div>
                    <div style="width: 500px;border:1px solid #eee">
                        <div class="demo-tree-more" id="test11" style="margin: 10px"></div>
                    </div>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button class="layui-btn" lay-filter="submit" lay-submit="" type="submit">保存</button>
                    <button class="layui-btn layui-btn-primary" id="btn_cancel1">取消</button>
                </div>
            </div>
        </form>
    </div>
</div>

</body>
</html>
<script id="switchTpl" th:inline="none" type="text/html">
    <input type="checkbox" lay-event="ex" value="{{ d.roleId}}-{{d.status}}" lay-skin="switch" lay-text="启用|停用" {{
           d.status== 1 ? '' : 'checked' }} disabled >
</script>


<script th:th:inline="javascript">

    //switch 开关监听接单
    // layui.use(['form'], function () {
    //     var form = layui.form;
    //     form.on('switch(isShow)',function (data) {
    //         var code = data.value;
    //         console.log(data);
    //         console.log(code);
    //         let t = data.value.split("-");
    //         console.log(t);
    //         var llo = layer.load(2,{shade:[0.001,'#fff']}); //layer.load() - 加载层
    //         $.ajax({
    //             url:'',
    //             type: "get",
    //             data: {code: code}, // 参数
    //             success: function(res) {
    //                 layer.close(llo); //layer.close(index) - 关闭特定层
    //                 if (res.code == 0) {
    //                     layer.alert('接单成功', {
    //                         icon: 1,
    //                         title: '提示'
    //                     }, function(i) {
    //                         layer.close(i);
    //                     })
    //                 }
    //             }
    //         });
    //         layer.close(llo);
    //
    //     });
    // });

</script>
<script th:inline="javascript">
    var ctx = [[@{/}]];
</script>
<script th:src="@{/static/system/role.js}"></script>
